<template>
	<view class="content-login" :style="{ height: scrollH + 'px' }">


		<view class="top-title-view">
			<view class="top-title-view-fish">
				<image src="@/static/login/bgicon.png" mode="aspectFit" class="bgicon"></image>
				<view class="title-view-center">
					<view class="title-name">星光农服</view>
				</view>
			</view>
		</view>
		<view class="login-view">
			<view class="login-view-line login-type-line">
				<view class="login-type" v-for="item,index in loginList" :key="index"
					:class="{ 'active': index == loginTypeIndex }" @click="toggleLogin(index)">
					{{ item }}
				</view>
			</view>
			<view class="login-view-line">
				<image src="../../static/login/user.png" mode="widthFix" class="icon" />
				<input class="form-input" name="input" v-model="username" placeholder="请输入用户名" />
			</view>
			<view class="login-view-line">
				<image src="../../static/login/password.png" mode="widthFix" class="icon" />
				<input class="form-input" name="inputPwd" v-model="password" placeholder="请输入密码"
					:password="showPassword" />
				<uni-icons v-if="showPassword" type="eye-filled" :color="'#8f8f94'" size="25" @click="changePassword"
					class="eyeicon" />
				<uni-icons v-else-if="!showPassword" type="eye-filled" :color="'#32bc92'" size="25"
					@click="changePassword" class="eyeicon" />
			</view>
			<view class="checkone">
				<view @click="gotoRegister()" class="zhuceyonghu">
					注册新用户
				</view>
				<view @click="findPassword()" class="checktwo">
					<label><text color="#32bc92">忘记密码</text></label>
				</view>
			</view>
			<view class="checkone">
				<label class="checktwo">
					<checkbox color="#0288ED" :checked="checked" @click="checkstaus()" />
					<text class="remember" style="color:#8B8B8B;">记住密码</text>
				</label>
			</view>
			<view class="click-but-view"><button @click="tologin()" class="loginbuttonstyle" :disabled="loginstau"
					:loading="loginstau">登 录</button></view>
			<!-- <view class="click-but-views"><button @click="toRegister()" class="loginbuttonstyle" :disabled="loginstau">注 册</button></view> -->
			<!-- 切换请求地址 -->
			<!-- <view @click="changeButton" class="change-buttom">
				切换智慧渔业
			</view> -->

		</view>
		<view class="bottom-view">
			<!-- <view class="bottom-view-line" @click="toprivacy()">隐私条款</view> -->
		</view>
		<view class="bottom-ios-line"></view>
		<app-update></app-update>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import {
		addressList
	} from '@/subPage1/plugins/address.js'
	import LoginApi from '@/api/socialized-servce/login/index.js'
	import agriculturalApi from '@/api/socialized-servce/agricultural-information/index.js'
	import AppUpdate from '@/components/app-update/app-update.vue'
	export default {
		comments: {
			AppUpdate
		},
		data() {
			return {
				loginList: ['企业用户登录', '个人用户登录'],
				loginTypeIndex: 0,
				// 点击登录的加载状态
				loginstau: false,
				// 展示密码
				showPassword: true,
				username: '',
				password: '',
				checked: true,
			}
		},
		computed: {
			scrollH: function() {
				let winHeight = 0
				uni.getSystemInfo({
					success: function(res) {
						winHeight = res.windowHeight
					}
				})
				winHeight = parseInt(winHeight)
				return winHeight
			}
		},
		onLoad(e) {
			// uni.getLocation({
			// 	type: 'gcj02', // 高德地图定位需要使用 gcj02 坐标系
			// 	success: (res) => {
			// 		let location = `${res.longitude},${res.latitude}`
			// 		uni.setStorageSync('lng', res.longitude)
			// 		uni.setStorageSync('lat', res.latitude)
			// 		let output = 'JSON'
			// 		let key = '8187d1c02d1ba1cd0e808bce16674652'
			// 		uni.request({
			// 			url: `https://restapi.amap.com/v3/geocode/regeo?output=${output}&location=${location}&key=${key}&extensions=all`,
			// 			method: 'get',
			// 			success: (res) => { //具体捕获请看自己接口返回的形式
			// 				if (res.data.info === 'OK') {
			// 					let address = res.data.regeocode.formatted_address
			// 					var reg = /.+?(省|市|自治区|自治州|县|区)/g;
			// 					let arr = address.match(reg).toString().split(",");
			// 					addressList.forEach(item => {
			// 						if (item.name === arr[0]) {
			// 							uni.setStorageSync('provinceId', item.provinceId)
			// 						}
			// 						item.city.forEach(item1 => {
			// 							if (item1.name === arr[1] && item.name ===
			// 								arr[0]) {
			// 								uni.setStorageSync('cityId', item1
			// 									.cityId)
			// 							}
			// 							if (item1.name === '市辖区' && item.name ===
			// 								arr[0]) {
			// 								uni.setStorageSync('cityId', item1
			// 									.cityId)
			// 							}

			// 							item1.area.forEach(item2 => {
			// 								if (item2.name === arr[2] &&
			// 									item.name === arr[0]) {
			// 									uni.setStorageSync(
			// 										'areaId', item2
			// 										.areaId)
			// 								}
			// 							})
			// 						})
			// 					})
			// 				}

			// 			},
			// 			fail(error) {
			// 				console.log(error);
			// 			},
			// 			complete() {

			// 			}
			// 		});
			// 	},
			// 	fail: (err) => {
			// 		console.error('定位失败', err);
			// 	}
			// });
			uni.removeStorage({
				key: 'jump'
			})
			e.username && (this.username = e.username);
			e.password && (this.password = e.password);
		},
		onShow() {
			this.loginTypeIndex = uni.getStorageSync('loginTypeIndex') || 0
			this.tianxie()
		},
		methods: {
			toggleLogin(index) {
				this.loginTypeIndex = index
				uni.setStorageSync('loginTypeIndex', index)
			},
			// ...mapMutations(['setUserInfo']),
			changeButton() {
				uni.redirectTo({
					url: '/pages/login/login'
				})
			},
			//注册新用户
			gotoRegister() {
				let url = '/pages/socialized-service/register/register'
				if (this.loginTypeIndex == 0) {
					url = '/pages/socialized-service/register/register-enterprise'
				}
				this.$togo(url)
			},
			//获取当前用户信息
			getUsermessage() {
				LoginApi.getLoginUser({
					partyType: 3,
					partyNo: uni.getStorageSync('partyNo'),
				}).then(res => {
					if (res.code === 200) {
						uni.setStorageSync('userServerInfo', JSON.stringify(res.data))
						uni.setStorageSync('userType', res.data.userType)
						uni.setStorageSync('userId', res.data.userId)
						uni.setStorageSync('userNo', res.data.userNo)
						this.sendCid();
						if (res.data.organizationFlag) {
							uni.setStorageSync('companyMask', res.data.serviceProviderBelongList || res.data
								.serviceProviderBelongList[0].companyMask)
						}
						if (res.data.serviceProviderFlag) {
							uni.setStorageSync('companyMask', res.data.companyMask)
						}
						if (!this.socketApi || this.socketApi === undefined || this.$socketApi === null) {
							uni.$emit('setupSocket')
						}
						uni.showToast({
							title: '登录成功',
							icon: 'none',
							position: 'bottom'
						});
						uni.switchTab({
							url: '/pages/socialized-service/order-center/order-center'
						})
					}
				})
			},
			async getOperatorList() {
				let params = {
					organizationNo: uni.getStorageSync('organizationNo')
				}
				let res = await LoginApi.queryOperator(params)
				if (res.code === 200 && res.data&&res.data.length > 0) {
					let operatorList = res.data || []
					// this.
					console.log(operatorList)
					let index = operatorList.findIndex(item => item.providerNo === uni.getStorageSync('providerNo'))
					// this.memberObj = res.data[0]
					if (index !== -1) {
						uni.setStorageSync('providerNo', operatorList[index].providerNo)
						uni.setStorageSync('providerName', operatorList[index].name)
					} else {
						uni.setStorageSync('providerNo', operatorList[0].providerNo)
						uni.setStorageSync('providerName', operatorList[0].name)
					}
				}
			},
			setAddress(data) {
				let pName = addressList.filter(el => el.provinceId == data.provinceId)[0].name
				let cName = addressList.filter(el => el.provinceId == data.provinceId)[0].city.filter(el1 => el1.cityId ==
					data.cityId)[0].name
				let aName = addressList.filter(el => el.provinceId == data.provinceId)[0].city.filter(el1 => el1.cityId ==
					data.cityId)[0].area.filter(el2 => el2.areaId == data.areaId)[0].name
				uni.setStorageSync('serviceProviderAddress', `${pName}${cName}${aName}${data.address}`)
			},
			async sendCid() {
				console.log('sendCid')
				let params = {
					cid: uni.getStorageSync('cid'),
					userId: uni.getStorageSync('userId'),
					clientType: uni.getStorageSync('clientType') === 'android'? 1 : 2,
					"partyType": 3,
					"userNo": uni.getStorageSync('userNo'),
					"partyNo": uni.getStorageSync('partyNo'),
					...JSON.parse(uni.getStorageSync('userServerInfo') || '{}'),
				}
				let res = await LoginApi.sendConfigCid(params)
				console.log('sendCid', params)
			},

			// 请求登录
			tologin() {
				// let params = new URLSearchParams()
				// params.append('username', this.username.trim())
				// params.append('password', this.password)
				let params = {
					username: this.username.trim(),
					password: this.password,
				}
				if (this.username == '') {
					uni.showToast({
						title: '未输入账户名',
						icon: 'none'
					})

				} else if (this.password == '') {
					uni.showToast({
						title: '未输入密码',
						icon: 'none'
					})
				} else {
					this.loginstau = true;
					uni.showLoading({
						title: '登录中...'
					});
					//判断存储信息
					uni.setStorageSync('username-sa', this.username);
					uni.setStorageSync('password-sa', this.password);
					LoginApi.login(params).then(async (res) => {
						uni.setStorageSync('tgt', res.replace(/\s/g, ""));
						this.tickets()
						// if(res.code !==200){
						// 	uni.showToast({
						// 		title:res.data.msg,
						// 		icon: 'none'
						// 	});
						// 	this.loginstau = false;
						// 	return;
						// } else {
						// 	let token = res.data;
						// 	uni.setStorageSync('satoken', token);
						// 	uni.setStorageSync('token', token);
						// 	this.loginstau = false;
						// 	//延时关闭  加载中的 loading框
						// 	uni.hideLoading();
						// 	await this.getIsMachinery()
						// 	await this.getIsAnchor()
						// 	await this.getIsExpert()
						// 	await this.getOperatorList()
						//  this.getUsermessage()
						// }
					}).catch(res => {
						uni.hideLoading();
						this.loginstau = false;
						uni.showToast({
							title: '登录失败，请重新登录',
							icon: 'none'
						});
					})
				}

			},
			tickets() {
				let tgt = uni.getStorageSync('tgt')
				let params = {
					service: 'http://192.168.117.148:46000/ssologin'
					// service: 'http://172.23.123.7:46000/ssologin'
				}
				LoginApi.tickets(tgt, params).then(res => {
					uni.setStorageSync('st', res.replace(/\s/g, ""));
					this.ssologin()
				}).catch(res => {
					uni.hideLoading();
					this.loginstau = false;
					uni.showToast({
						title: '登录失败，请重新登录',
						icon: 'none'
					});
				})
			},
			ssologin() {
				LoginApi.ssologin(uni.getStorageSync('st')).then(res => {
					// this.queryToken()
					if (res.data[0] == 'register') {
						LoginApi.getUserInfo().then(res => {
							this.registerSocialized(res.data)
						})
					} else if (res.data[0]) {
						uni.setStorageSync('satoken', res.data[0].replace(/\s/g, ""));
						uni.setStorageSync('token', res.data[0].replace(/\s/g, ""));
						this.getUserNo()
					} else {
						uni.showToast({
							title: '登录失败，请重新登录',
							icon: 'none'
						});
					}
					uni.hideLoading();
					this.loginstau = false;
				}).catch(res => {
					uni.hideLoading();
					this.loginstau = false;
					uni.showToast({
						title: '登录失败，请重新登录',
						icon: 'none'
					});
				})
			},
			registerSocialized(param) {
				LoginApi.registerSocialized(param).then(res => {
					if (res.code == 200) {
						this.tologin()
					} else {
						uni.hideLoading();
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				})
			},
			// queryToken() {
			// 	LoginApi.token().then(res => {
			// 		if (res.data == 'register') {
			// 			LoginApi.getUserInfo().then(res => {
			// 				this.registerSocialized(res.data)
			// 			})
			// 		} else if (res.data) {
			// 			uni.setStorageSync('satoken', res.data.replace(/\s/g, ""));
			// 			uni.setStorageSync('token', res.data.replace(/\s/g, ""));
			// 			this.getUserNo()
			// 			// this.getUsermessage()
			// 		} else {
			// 			uni.showToast({
			// 				title: '登录失败，请重新登录',
			// 				icon: 'none'
			// 			});
			// 		}
			// 		uni.hideLoading();
			// 		this.loginstau = false;
			// 	}).catch(res => {
			// 		uni.hideLoading();
			// 		this.loginstau = false;
			// 		uni.showToast({
			// 			title: '登录失败，请重新登录',
			// 			icon: 'none'
			// 		});
			// 	})
			// },
			getUserNo() {
				LoginApi.getUserInfo().then(res => {
					uni.setStorageSync('userNo', res.data.userNo)
					uni.setStorageSync('userName', res.data.userName)
					// console.log(11111);
					this.queryParty()
				})
			},
			queryParty() {
				// console.log(22222);
				LoginApi.queryEntryInfo({
					partyType: 3,
					userNo: uni.getStorageSync('userNo'),
					active: true
				}).then(res => {
					uni.hideLoading();
					// console.log(33333);
					if (res.data.length) {
						// console.log(44444);
						let row = res.data.find(el => {
							return el.defaultFlag
						})
						let partyObj = row || res.data[0]
						uni.setStorageSync('partyNo', partyObj.organization && partyObj.organization.organizationNo);
						uni.setStorageSync('organizationNo', partyObj.organization && partyObj.organization.organizationNo);
						uni.setStorageSync('organizationName', partyObj.organization && partyObj.organization.name);
						uni.setStorageSync('manageUserNo', partyObj.organization && partyObj.organization.manageUserNo)
						this.getOperatorList()
						this.getUsermessage()
					} else {
						// console.log(55555);
						uni.setStorageSync('partyNo', '');
						uni.setStorageSync('providerNo', '');
						uni.switchTab({
							url: '/pages/socialized-service/person-message/person-message'
						})
					}
				})
			},
			// 判断是否农机手
			async getIsMachinery() {
				let res = await LoginApi.queryIsMachinery()
				if (res.code === 200) {
					uni.setStorageSync('isMachinery', res.data)
				}
			},
			async getIsExpert() {
				let res = await LoginApi.queryIsExpert()
				if (res.code === 200) {
					uni.setStorageSync('isExpert', res.data)
				}
			},
			// 判断是否为主播
			async getIsAnchor() {
				let res = await LoginApi.queryIsAnchor()
				if (res.code === 200) {
					uni.setStorageSync('isAnchor', res.data)
				}
			},
			// 隐私协议
			toprivacy() {
				// console.log(1);
				uni.navigateTo({
					url: '/pages/login/privacy'
				})
			},

			//密码显示隐藏方法
			changePassword: function() {
				this.showPassword = !this.showPassword
			},
			//自动填写密码账户方法
			tianxie() {
				var che = uni.getStorageSync('checked-sa')
				if (che) {
					this.checked = true
				} else {
					this.checked = false
				}
				if (this.checked == true) {
					var acc = uni.getStorageSync('username-sa')
					if (acc) {
						this.username = uni.getStorageSync('username-sa')
						this.password = uni.getStorageSync('password-sa')
						// this.tologin()
					}
				} else {
					this.username = ''
					this.password = ''
				}
			},
			// 获取是否保存密码状态
			checkstaus() {
				this.checked = !this.checked
				uni.setStorageSync('checked-sa', this.checked)
			},
			// =========================
			findPassword() {
				uni.navigateTo({
					url: '/pages/find-password/find-password'
				})
			},
			// toRegister() {
			// 	uni.navigateTo({
			// 		url: '../register/register'
			// 	})
			// },
			// ===========================
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .uni-checkbox-wrapper {
		.uni-checkbox .uni-checkbox-input {
			margin-right: 5px;
			-webkit-appearance: none;
			appearance: none;
			outline: 0;
			border: 1px solid #d1d1d1;
			background-color: #fff;
			border-radius: 3px;
			width: 26rpx;
			height: 26rpx;
			position: relative;
		}
	}

	.change-buttom {
		text-decoration: underline
	}

	.content-login {
		width: 100%;
		background-color: #FFFFFF;

		.top-title-view {
			position: relative;
			width: 100%;
			height: 430rpx;
			// background: linear-gradient(180deg, #0480FB 0%, #0480FB 100%);
			background: url(@/static/login/bg.png);
			background-repeat: no-repeat;
			background-size: 100% 100%;
			padding-top: 80rpx;

			.top-title-view-fish {

				// position: relative;
				// width: 100%;
				// height: 100%;
				.fish-view {

					// height: 100rpx;
					.bigfish {
						position: absolute;
						top: 100rpx;
						height: 120rpx;
						width: 250rpx;
					}

					.smallfish {
						position: absolute;
						top: 200rpx;
						right: 0;
						height: 100rpx;
						width: 150rpx;
					}
				}

				.bgicon {
					position: absolute;
					bottom: 50rpx;
					right: calc(50% - 75rpx);
					height: 100rpx;
					width: 150rpx;
				}
			}

			.title-view-center {
				width: 100%;
				margin-top: 140rpx;
				height: 130rpx;
				display: flex;
				flex-wrap: wrap;
				justify-content: center;

				.title-img {
					height: 64rpx;
					width: 258rpx;
				}

				.title-name {
					height: 50rpx;
					width: 100%;
					text-align: center;
					height: 50rpx;
					line-height: 50rpx;
					color: #FFFFFF;
					font-size: 52rpx;
					font-weight: 400;
					letter-spacing: 4rpx;
				}
			}

			.gif-wave {
				position: absolute;
				width: 100%;
				bottom: -2rpx;
				left: 0;
				z-index: 99;
				mix-blend-mode: screen;
				height: 200rpx;
				width: 100%;

				// background-color: #000000;
				.gif-wave-img {
					height: 200rpx;
					width: 100%;
				}
			}
		}

		.login-view {
			width: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			position: relative;
			padding-top: 50rpx;

			.login-view-line {
				width: 473rpx;
				height: 90rpx;
				border-bottom: 2px solid #ececec;
				display: flex;
				align-items: center;
				justify-content: space-between;
				position: relative;

				&.login-type-line {
					border-bottom: none;
					width: 60%;
					text-align: center;

					.login-type {
						padding-bottom: 10rpx;

						&.active {
							font-weight: bold;
							border-bottom: 3px solid #4f85ff;
						}
					}
				}

				.icon {
					height: 40rpx;
					width: 40rpx;
				}

				.eyeicon {
					position: absolute;
					z-index: 99;
					right: 5px;
				}

				.form-input {
					font-size: 25rpx;
					line-height: 60rpx;
					background-color: transparent;
					color: rgb(96, 96, 96);
					width: calc(100% - 36px);
					height: 60rpx;
				}
			}

			.click-but-view {
				width: 472rpx;
				height: 64rpx;
				display: flex;
				justify-content: center;
				margin-bottom: 40rpx;
				margin-top: 88rpx;

				.loginbuttonstyle {
					width: 472rpx;
					height: 64rpx;
					font-weight: 400;
					color: #FFFFFF;
					line-height: 64rpx;
					font-size: 28rpx;
					letter-spacing: 20rpx;
					border-radius: 80rpx;
					background-color: #0288ED;
					box-shadow: 0rpx 0rpx 14rpx 2rpx #0288ED;
				}
			}

			.click-but-views {
				width: 580rpx;
				height: 80rpx;
				display: flex;
				justify-content: center;
				margin-bottom: 40rpx;

				.loginbuttonstyle {
					width: 580rpx;
					height: 80rpx;
					margin: 0rpx 15%;
					color: rgba(50, 204, 151, 1);
					font-size: 35rpx;
					font-weight: 500;
					letter-spacing: 20rpx;
					line-height: 80rpx;
					border-radius: 80rpx;
					background-color: #ffffff;
					box-shadow: 0px 0px 7px rgba(33, 222, 157, 1);
				}
			}
		}

		.uni-navbar {
			width: 100%;
			padding-top: var(--status-bar-height);
		}

		.checkone {
			width: 473rpx;
			display: flex;
			justify-content: space-between;
			margin-top: 26rpx;
			position: relative;

			.zhuceyonghu {}
		}

		.checktwo {
			display: flex;
			flex-direction: row-reverse;
			position: absolute;
			right: 0;
			color: rgb(50, 188, 146);
			z-index: 99;

			::v-deep .uni-checkbox-input {
				margin-right: 0;
			}

			.remember {
				line-height: 48rpx;
				margin-right: 10rpx;
			}
		}

		.bottom-view {
			position: absolute;
			bottom: 10rpx;
			width: 100%;
			height: 60rpx;
			line-height: 60rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.bottom-view-line {
				height: 60rpx;
				line-height: 60rpx;
				color: #84878c;
				text-decoration: underline;
			}
		}
	}
</style>